@use "../../../Assets/sass/devtoys" as *;

.drop-down-list {
    @include typography-body;
    pointer-events: auto;

    &-with-header {
        display: flex;
        flex-direction: column;
        position: relative;

        .drop-down-list-header {
            margin-bottom: 4px;
        }
    }

    &-button {
        .arrow-down-icon {
            margin-left: 4px;
            transition-duration: 0.2s;
            transition-property: transform;
            color: currentColor !important;
        }

        &:active {
            .arrow-down-icon {
                transform: translateY(2px);
                color: currentColor !important;
            }
        }
    }
}

.drop-down-list-drop-down {
    margin-top: 4px !important;

    &[data-popover-flip="flipped"] {
        margin-top: -4px !important;
    }
}